/**
 * Created by Dalyn on 2017/5/8.
 */
import React from "react";
import {hashHistory} from 'react-router';
import Relay from "react-relay";
import {  Tabs,DatePicker, message } from 'antd';
const TabPane = Tabs.TabPane;
import moment from 'moment';
const { MonthPicker, RangePicker } = DatePicker;
import ReactKey from "../../../util/ReactKey";
import Util from "../../../util/Util"
import GetProDigestMutation from "./mutation/GetProDigestMutation"
import UpdateFinishDateMutation from "./mutation/UpdateFinishDateMutation"
import "./css/productionLicense_index.css";
import "../css/productionManagement_common.css";
/*编辑组件*/
import ProductionNumberDetail from "./licenseEdit/ProductionNumberDetail";
import ProductionDigestImage from "./licenseEdit/ProductionDigestImage";
import MaterialBill from "./licenseEdit/MaterialBill";
import ProductionSize from "./licenseEdit/ProductionSize";
import OtherRequirements from "./licenseEdit/OtherRequirements";
import PackStep from "./licenseEdit/PackStep";
import ProcessDemand from "./licenseEdit/ProcessDemand";
import FabricRaw from "./licenseEdit/FabricRaw";
/*编辑组件*/
import ProductionNumberDetailLook from "./licenseLook/ProductionNumberDetailLook";
import ProductionDigestImageLook from "./licenseLook/ProductionDigestImageLook";
import MaterialBillLook from "./licenseLook/MaterialBillLook";
import ProductionSizeLook from "./licenseLook/ProductionSizeLook";
import OtherRequirementsLook from "./licenseLook/OtherRequirementsLook";
import PackStepLook from "./licenseLook/PackStepLook";
import ProcessDemandLook from "./licenseLook/ProcessDemandLook";
import FabricRawLook from "./licenseLook/FabricRawLook";
export default class Payment extends React.Component{

    constructor(props) {
        super(props);
        this.state = {
            finishDate:"",
            finishDateSelf:"",
            editLook:this.props.location.state.editLook,
            proDigestModel:"",
            pdId:this.props.location.state.pdId,
        };
        // this.pdId = this.props.location.state.pdId;
        this.finishDate = "";
        // this.uid=sessionStorage.getItem("uid");
    }
    componentWillMount(){
        this.proDigest();
    }
    /*查询数据*/
    proDigest(pageSize,pageNum){
        Relay.Store.commitUpdate(
            new GetProDigestMutation({
                pdId:this.state.pdId,
            }),
            {
                onFailure: () => {
                    message.error('请求失败');
                },
                onSuccess: (response) => {
                    let errorCode = response.getProDigest.responseData.errorCode;
                    let value = response.getProDigest.responseData.value;
                    if(errorCode=='0'){
                        let proDigestModel = response.getProDigest.responseData.proDigestModel;
                        this.setState({
                            proDigestModel:proDigestModel,
                            finishDate:proDigestModel.finishDate,
                            finishDateSelf:proDigestModel.finishDate,
                        });
                    }else {
                        message.info(value);
                    }
                }
            }
        )
    }

    /*更新数据*/
    updateFinishDate(date){
        // let {finishDate,finishDateSelf} = this.state;
        // if((finishDateSelf == null||finishDateSelf == "")&&(finishDate == null||finishDate == ""))return;
        // if(finishDate == finishDateSelf)return;
        Relay.Store.commitUpdate(
            new UpdateFinishDateMutation({
                pdId:this.state.pdId,
                finishDate:date,
            }),
            {
                onFailure: () => {
                    message.error('网络请求失败');
                },
                onSuccess: (response) => {
                    let errorCode = response.updateFinishDate.responseData.errorCode;
                    let value = response.updateFinishDate.responseData.value;
                    if(errorCode=='0'){
                        let proDigestModel = response.updateFinishDate.responseData.proDigestModel;
                        this.setState({
                            proDigestModel:proDigestModel,
                            finishDate:proDigestModel.finishDate,
                            finishDateSelf:proDigestModel.finishDate,
                        },()=>{
                            message.success("修改货期成功");
                        });
                    }else {
                        // message.info(value);
                        if (errorCode == 500){
                            message.error('服务器错误,请联系系统管理员');
                        }
                    }
                }
            }
        )
    }
    /*Tabs组件回调*/
    callback(key){
        // console.log(key);
    }
    /*日历组件方法*/
    dateConfirm(value){
        let finishDate = this.state.finishDate;
        this.updateFinishDate(finishDate);
    }
    onChangeDate(date, dateString) {
        this.finishDate = dateString;
        if(date == null&&dateString == ""){
            this.updateFinishDate("");
            return
        }
        /*转时间戳*/
        this.setState({
            finishDate:Util.timeStamp(dateString),
        })

    }
    dateConfirmno(){

        let finishDateSelf = this.state.finishDateSelf;
        if(finishDateSelf){
            this.updateFinishDate(finishDateSelf);
        }else {
            // message.warning("请选择日期")
            return
        }

    }
    onChangeDateno(date, dateString){

        this.finishDate = dateString;
        /*转时间戳*/
        this.setState({
            finishDateSelf:Util.timeStamp(dateString),
        })
    }
    render(){
        const dateFormat = 'YYYY-MM-DD';
        const proDigestModel = ( null == this.state.proDigestModel)?{}:this.state.proDigestModel;
        // this.finishDate = proDigestModel.finishDate?Util.dateFormat(proDigestModel.finishDate).toString():"";
        return (
            <div className="poduction_manage_box" >
                <div className="productionLicense_index_info">
                    <div className="productionLicense_index_payInfo">
                        <p className="productionLicense_index_p">
                            <span className="productionLicense_index_span">订单编号：</span>
                            <span className="productionLicense_index_orderspan">{proDigestModel.orderId}</span>
                        </p>
                        <p className="productionLicense_index_p">
                            <span className="productionLicense_index_span">款&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号：</span>
                            <span className="productionLicense_index_orderspan">{proDigestModel.styleNo}</span>
                        </p>
                        <p className="productionLicense_index_p">
                            <span className="productionLicense_index_span" >货&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;期：</span>
                              <span className="productionLicense_index_cal" ref={"productionLicense_index_span"}>
                                  {
                                      this.state.editLook?
                                          (
                                              this.state.finishDate
                                                  ?
                                                  (
                                                      <DatePicker
                                                        className="production_index_datePicker111"
                                                        popupClassName="production_index_datePicker"
                                                        onChange={this.onChangeDate.bind(this)}
                                                        showTime
                                                        key={proDigestModel.pdId+proDigestModel.styleNo}
                                                        showToday={false}
                                                        onOk={this.dateConfirm.bind(this)}
                                                        getCalendarContainer = {() => {
                                                          return this.refs.productionLicense_index_span;
                                                        }}
                                                        value={moment(Util.dateFormat(this.state.finishDate), dateFormat)}/>
                                                  )
                                                  :
                                                  (
                                                      <DatePicker
                                                        popupClassName="production_index_datePicker"
                                                        onChange={this.onChangeDateno.bind(this)}
                                                        showTime
                                                        key={proDigestModel.pdId+proDigestModel.orderId}
                                                        showToday={false}
                                                        onOk={this.dateConfirmno.bind(this)}
                                                        getCalendarContainer = {() => {
                                                          return this.refs.productionLicense_index_span;
                                                        }}
                                                      />
                                                  )
                                          ):(
                                              <span className="productionLicense_index_orderspan">{Util.dateFormat(this.state.finishDate)}</span>
                                      )

                                  }
                                  </span>
                        </p>
                    </div>
                    <div className="productionLicense_index_ordermoney">
                        <p className="productionLicense_index_p">
                            <span className="productionLicense_index_span">客&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;户：</span>
                            <span className="productionLicense_index_orderspan">{proDigestModel.customerName}</span>
                        </p>
                        <p className="productionLicense_index_p">
                            <span className="productionLicense_index_span">业&nbsp;&nbsp;务&nbsp;&nbsp;员：</span>
                            <span className="productionLicense_index_orderspan">{proDigestModel.operationName}</span>
                        </p>
                        <p className="productionLicense_index_p">
                            <span className="productionLicense_index_span">数&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;量：</span>
                            <span className="productionLicense_index_orderspan">{proDigestModel.number}{proDigestModel.prickle}</span>
                        </p>
                    </div>
                </div>
                {
                    this.state.editLook
                        ?
                        (
                            <Tabs defaultActiveKey="ProductionDigestImage" onChange={this.callback.bind(this)} className="dkfajl">
                                <TabPane tab="图片" key="ProductionDigestImage">
                                    <ProductionDigestImage pdId={this.state.pdId} _updateFinishDate={this.updateFinishDate.bind(this)}/>
                                </TabPane>
                                <TabPane tab="数量" key="ProductionNumberDetail">
                                    <ProductionNumberDetail pdId={this.state.pdId} _updateFinishDate={this.updateFinishDate.bind(this)}/>
                                </TabPane>
                                <TabPane tab="工艺要求" key="ProcessDemand">
                                    <ProcessDemand pdId={this.state.pdId} _updateFinishDate={this.updateFinishDate.bind(this)}/>
                                </TabPane>
                                <TabPane tab="尺寸表" key="ProductionSize">
                                    <ProductionSize pdId={this.state.pdId}  _updateFinishDate={this.updateFinishDate.bind(this)}/>
                                </TabPane>
                                <TabPane tab="物料清单" key="MaterialBill">
                                    <MaterialBill pdId={this.state.pdId} _updateFinishDate={this.updateFinishDate.bind(this)}/>
                                </TabPane>
                                <TabPane tab="包装步骤" key="PackStep">
                                    <PackStep _updateFinishDate={this.updateFinishDate.bind(this)} pdId={this.state.pdId} />
                                </TabPane>
                                {/*<TabPane tab="面辅料进度" key="FabricRaw">
                                    <FabricRaw _updateFinishDate={this.updateFinishDate.bind(this)} pdId={this.state.pdId} orderId={proDigestModel.orderId}/>
                                </TabPane>*/}
                                <TabPane tab="其他要求" key="OtherRequirements">
                                    <OtherRequirements  pdId={this.state.pdId} _updateFinishDate={this.updateFinishDate.bind(this)}/>
                                </TabPane>
                            </Tabs>
                        )
                        :
                        (
                            <Tabs defaultActiveKey="ProductionDigestImage">
                                <TabPane tab="图片" key="ProductionDigestImage">
                                    <ProductionDigestImageLook pdId={this.state.pdId} _updateFinishDate={this.updateFinishDate.bind(this)}/>
                                </TabPane>
                                <TabPane tab="数量" key="ProductionNumberDetail">
                                    <ProductionNumberDetailLook pdId={this.state.pdId} _updateFinishDate={this.updateFinishDate.bind(this)}/>
                                </TabPane>
                                <TabPane tab="工艺要求" key="ProcessDemand">
                                    <ProcessDemandLook  pdId={this.state.pdId} _updateFinishDate={this.updateFinishDate.bind(this)}/>
                                </TabPane>
                                <TabPane tab="尺寸表" key="ProductionSize">
                                    <ProductionSizeLook   pdId={this.state.pdId} _updateFinishDate={this.updateFinishDate.bind(this)}/>
                                </TabPane>
                                <TabPane tab="物料清单" key="MaterialBill">
                                    <MaterialBillLook pdId={this.state.pdId} _updateFinishDate={this.updateFinishDate.bind(this)}/>
                                </TabPane>
                                <TabPane tab="包装步骤" key="PackStep">
                                    <PackStepLook   pdId={this.state.pdId} _updateFinishDate={this.updateFinishDate.bind(this)}/>
                                </TabPane>
                                {/*<TabPane tab="面辅料进度" key="FabricRaw">
                                    <FabricRawLook _updateFinishDate={this.updateFinishDate.bind(this)} pdId={this.state.pdId} orderId={proDigestModel.orderId}/>
                                </TabPane>*/}
                                <TabPane tab="其他要求" key="OtherRequirements">
                                    <OtherRequirementsLook pdId={this.state.pdId} _updateFinishDate={this.updateFinishDate.bind(this)}/>
                                </TabPane>
                            </Tabs>
                        )
                }

            </div>
        )
    }
}
